<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">

    <meta content="telephone=yes,email=yes" name="format-detection">
    <!--//自动识别电话号码和邮箱-->

    <meta content="yes" name="apple-mobile-web-app-capable">
    <!--//苹果手机：会删除默认的工具栏和菜单栏，网站开启对web app程序的支持-->
    <meta name="apple-mobile-web-app-status-bar-style" content="default"/>
    <!--//苹果手机：在web app应用下状态条（屏幕顶部条）的颜色,默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）。-->
    <meta name="apple-touch-fullscreen" content="yes"/>
    <!--//苹果手机：如果把一个web app添加到了主屏幕中，那么从主屏幕中打开这个web app则全屏显示-->
    <link rel="apple-touch-icon" href="images/identity/HTML5_Badge_64.png"/>
    <!--//苹果手机：将应用添加到手机主屏幕，会有一个icon可以直接进入-->


    <title>有收入</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <!--初始化样式-->
    <link rel="stylesheet" href="css/reset.css">
    <!--轮播样式-->
    <link rel="stylesheet" href="css/swiper.min.css">
    <!--共用样式-->
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/index.css">
    <!--整个网站的局部样式-->
    <link rel="stylesheet" href="css/style.css">
    <!--适配样式-->
    <link rel="stylesheet" href="css/styleMedia.css">
    <style>
    	.mui-pull-top-pocket {
		    display: none !important;
		}
    </style>
</head>

<body id="refreshContainer" style="background-color:#f4f9fd ">
<!--header begin-->
<header>
    <div id="flexHeader">
        <div class="div1"></div>
        <div class="div2">我的</div>
        <div class="div3" onclick="pageJump(this)" name="myNews">
             <a><img class="img-info" src="images/icon_new_red.png"></a>
        </div>
    </div>
</header>
<!--header end-->

<!--top info begin-->
<article class="clearfix my-top">
    <div class="me-img">
        <img src="images/img_tx.png">
    </div>
    <div class="id-tel">
        <div><span>ID:</span><span id="userId"></span></div>
        <div><span>手机号:</span><span id="userPhone"></span></div>
    </div>
    <div class="QCoder"><img src="images/img_ewm.png"></div>
</article>
<!--top info end-->

<!--put-forward begin-->
<article class="put-forward">
    <div class="put-forward-top" onclick="pageJump(this)" name="commission">
        <div><p>我要提现</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-money">
        <div>
            <p class="count" id="principal">0</p>
            <p class="text-style">我要提现</p>
        </div>
        <div>
            <p class="count" id="brokerage">0</p>
            <p class="text-style">佣金余额</p>
        </div>
        <div>
            <p id="profitCount" class="count">0</p>
            <p class="text-style">累计收益</p>
        </div>
        <div>
            <p id="withdrawCount" class="count">0</p>
            <p class="text-style">提现中</p>
        </div>
    </div>
</article>
<!--put-forward end-->

<!--task begin-->
<article class="task">
    <div class="put-forward-top" onclick="pageJump(this)" name="alreadyConnectedTask">
        <div><p>全部任务</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-money">
        <div>
            <p id="s01" class="count">0</p>
            <p class="text-style">待操作</p>
        </div>
        <div>
            <p id="total" class="count">0</p>
            <p class="text-style">总接单</p>
        </div>
        <div>
            <p id="unFinish" class="count">0</p>
            <p class="text-style">进行中</p>
        </div>
        <div>
            <p id="inEvalution" class="count">0</p>
            <p class="text-style">待评价</p>
        </div>
    </div>
</article>
<!--task end-->

<!--list begin-->
<article class="list-nav">
    <a href="#">
        <div class="put-forward-top" onclick="pageJump(this)" name="bindOnAccount">
            <div><p>绑定账号</p></div>
            <div><img src="images/icon_arrow.png"></div>
        </div>
    </a>

    <div class="put-forward-top" onclick="pageJump(this)" name="dailyTasks">
        <div><p>每日福利</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" onclick="pageJump(this)" name="promotingMoney">
        <div><p>推广赚金</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" onclick="pageJump(this)" name="clickSelectTemplate">
        <div><p>专属二维码</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" onclick="pageJump(this)" name="help">
        <div><p>帮助与客户</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" onclick="pageJump(this)" name="ruleOrder">
        <div><p>账号完成率</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" onclick="pageJump(this)" name="complaintCenter">
        <div><p>申诉中心</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" style="border-bottom:none" onclick="pageJump(this)" name="set">
        <div><p>设置</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
    <div class="put-forward-top" onclick="pageJump(this)" name="versionInformation">
        <div><p>版本信息</p></div>
        <div><img src="images/icon_arrow.png"></div>
    </div>
</article>
<!--list end-->

<!--footer begin-->
<footer>
    <div id="flexFooter">
        <div class="div-footer">
            <a href="index.html">
                <img src="images/icon_index_home@2x.png"/>
                <p>首页</p>
            </a>
        </div>
        <div class="div-footer" onclick="pageJump(this)" name="makeMoney_new">
            <a href="#">
                <img class="imgMid" src="images/icon_index_add@2x.png"/>
            </a>
        </div>
        <div class="div-footer">
            <a href="#">
                <img src="images/icon_index_me_select@2x.png"/>
                <p class="p-select">我的</p>
            </a>

        </div>
    </div>
</footer>
<!--footer end-->
<script src="js/jquery-1.12.3.min.js"></script>
<script src="js/mui.min.js"></script>
<script src="js/config.js"></script>
<script src="js/vconsole.min.js"></script>
<script>
	var vConsole = new VConsole()
	var user
	$(function(){
		user = JSON.parse(localStorage.getItem('user'))
		load()
	})
	function pageJump(dom){
		var name = $(dom).attr('name')
		var target = name + ".html?origin=myself.html"
		window.location = target
	}

	mui.init({
		pullRefresh : {
		    container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
		    down : {
		      style:'circle',//必选，下拉刷新样式，目前支持原生5+ ‘circle’ 样式
		      color:'#2BD009', //可选，默认“#2BD009” 下拉刷新控件颜色
		      height:'50px',//可选,默认50px.下拉刷新控件的高度,
		      range:'100px', //可选 默认100px,控件可下拉拖拽的范围
		      offset:'0px', //可选 默认0px,下拉刷新控件的起始位置
		      auto: false,//可选,默认false.首次加载自动上拉刷新一次
		      callback : refrash //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
		    }
		}
	});
	
	function refrash() {
		console.log('hello foo')
		load()
		mui('#refreshContainer').pullRefresh().endPulldown();
	}
	function load() {
		$.ajax({
			url: $CONFIG.baseUrl+"/api/user/" + user.id + "/statistics",
			type: 'get',
			contentType:false,
			processData:false,
			beforeSend:function(x){
				x.setRequestHeader("Authorization", localStorage.getItem('token'))
			},
			success: function(data){
				$('#s01').html(data.data.orderCounter.s0 + data.data.orderCounter.s1)
				$('#total').html(data.data.orderCounter.total)
				$('#unFinish').html(data.data.orderCounter.s0 + data.data.orderCounter.s1 + data.data.orderCounter.s2 + data.data.orderCounter.s3 + data.data.orderCounter.s4)
				$('#inEvalution').html(data.data.orderCounter.s3)
				$('#withdrawCount').html(data.data.inWithdraw)
				$('#userId').html(data.data.user.id)
				$('#userPhone').html(data.data.user.phone)
				$('#principal').html(data.data.user.principal)
				$('#brokerage').html(data.data.user.brokerage)
				$('#profitCount').html(data.data.user.profitCount)
				console.log(JSON.stringify(data))
			},
			error: function(error){
				mui.toast('数据加载失败，请检查网络')
			}
		})
	}
</script>

<!--js-->
</body>
</html>